<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="${staticServerAddress }/title.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<title>微风网</title>
</head>
<body>
	<!-- 顶部tab -->
	<div class="tab-header">
		<div class="inner">
			<div class="pull-left">
				<div class="pull-left">嗨，欢迎来到<span class="cr">微风网</span></div>
				<a href="toAgentleavel">网店代销</a>
				<a href="toBreezeArticle4">帮助中心</a>
			</div>
			<div class="pull-right">
				<c:choose>
					<c:when test="${userId>0}">
						<a href="SignOut">注销登录</a>
					</c:when>
					<c:otherwise>
						<a href="toLogin"><span class="cr">登录</span></a>
						<a href="toLogin?p=register">注册</a>
					</c:otherwise>
				</c:choose>
				<a href="toBreezeWelcome">我的微风</a>
				<a href="lineItem">我的订单</a>
				<a href="toBreezeIntegral">积分平台</a>
			</div>
		</div>
	</div>
	<!-- 搜索栏 -->
	<div class="top-search">
		<div class="inner">
			<a class="logo" href="home"><img src="images/icons/logo.jpg" alt="微风网" class="cover"></a>
			<div class="search-box">
				<form class="input-group" id="search" action="category" method="post" >
					<input type="hidden" name="pageIdx" value="1"/>
					<input type="hidden" name="startPrice" value="${startPrice }"/>
					<input type="hidden" name="endPrice" value="${endPrice }"/>
					<input type="hidden" name="threeClassification" value="${threeClassification }"/>
					<input placeholder="Ta们都在搜微风网" type="text" name="searchName" value="${searchName }">
					<span class="input-group-btn">
						<button type="submit">
							<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
						</button>
					</span>
				</form>
				<p class="help-block text-nowrap">
					<a href="category?threeClassification=小说&pageIdx=1&startPrice=0&endPrice=0&searchName= ">小说</a>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<a href="category?threeClassification=文艺&pageIdx=1&startPrice=0&endPrice=0&searchName= ">文艺</a>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<a href="category?threeClassification=历史&pageIdx=1&startPrice=0&endPrice=0&searchName= ">历史</a>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<a href="category?threeClassification=经济&pageIdx=1&startPrice=0&endPrice=0&searchName= ">经济</a>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<a href="category?threeClassification=心理&pageIdx=1&startPrice=0&endPrice=0&searchName= ">心理</a>
				</p>
			</div>
			<div class="cart-box">
				<a href="toBreezeShopcart" class="cart-but">
					<i class="iconfont icon-shopcart cr fz16"></i> 购物车 ${shoppingCartNum==null?0:shoppingCartNum } 件
				</a>
			</div>
		</div>
	</div>
	<!-- 内页导航栏 -->
	<div class="top-nav bg3">
		<div class="nav-box inner">
			<div class="all-cat">
				<div class="title"><i class="iconfont icon-menu"></i> 全部分类</div>
			</div>
			<ul class="nva-list">
				<a href="home"><li>首页</li></a>
				<a href="toBreezeArticle10"><li>企业简介</li></a>
				<a href="toBreezeArticle5"><li>新手上路</li></a>
				<a href="toClassRoom"><li>微风学堂</li></a>
				<a href="toEnterpriseId"><li>企业账号</li></a>
				<a href="toBreezeContract"><li>诚信合约</li></a>
				<a href="toItemRemove"><li>实时下架</li></a>
			</ul>
		</div>
	</div>
	<div class="content inner">
		<section class="filter-section clearfix">
			<ol class="breadcrumb">
				<li><a href="home">首页</a></li>
				<li class="active">商品筛选</li>
			</ol>
			<div class="filter-box">
				<div class="all-filter">
					<div class="filter-value">
						<div class="filter-title">选择商品分类 <i class="iconfont icon-down"></i></div>
						<!-- 全部大分类 -->
						<ul class="catelist-card">
							<a href="#"><li class="active">全部分类</li></a>
						</ul>
						<!-- 已选选项 -->
						<div class="ul_filter">
						</div>
						<a class="reset pull-right" href=#>重置</a>
					</div>
				</div>
				<div class="filter-prop-item">
					<span class="filter-prop-title">全部分类：</span>
					<ul class="clearfix">
						<a href="#"><li class="active">全部</li></a>
							<a href="javascript:void(0);"><li>文学</li></a>
							<a href="javascript:void(0);"><li>男装</li></a>
							<a href="javascript:void(0);"><li>包包</li></a>
							<a href="javascript:void(0);"><li>童装</li></a>
							<a href="javascript:void(0);"><li>鞋靴</li></a>
					</ul>
				</div>
				<div class="filter-prop-item">
					<span class="filter-prop-title">网络文学：</span>
					<ul class="clearfix">
						<a href="#"><li class="active">全部</li></a>
						<a href="category?threeClassification=玄幻奇幻&pageIdx=1&startPrice=0&endPrice=0&searchName= "><li>玄幻奇幻</li></a>
						<a href="category?threeClassification=现代都市&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>现代都市</li></a>
						<a href="category?threeClassification=武侠仙侠&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>武侠仙侠</li></a>
						<a href="category?threeClassification=游戏竞技&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>游戏竞技</li></a>
						<a href="category?threeClassification=科幻灵异&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>科幻灵异</li></a>
					</ul>
				</div>
				<div class="filter-prop-item">
					<span class="filter-prop-title">电&nbsp;&nbsp;子&nbsp;&nbsp;书：</span>
					<ul class="clearfix">
						<a href="#"><li class="active">全部</li></a>
						<a href="category?threeClassification=小说&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>小说</li></a>
						<a href="category?threeClassification=文艺&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>文艺</li></a>
						<a href="category?threeClassification=历史&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>历史</li></a>
						<a href="category?threeClassification=经济&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>经济</li></a>
						<a href="category?threeClassification=心理&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>心理</li></a>
						<a href="category?threeClassification=生活&pageIdx=1&startPrice=0&endPrice=0&searchName="><li>侦探</li></a>
					</ul>
				</div>
				<div class="filter-prop-item">
					<span class="filter-prop-title">价&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格：</span>
					<ul class="clearfix">
						<a href="#"><li class="active">全部</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=0&endPrice=20&searchName="><li>0-20</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=20&endPrice=40&searchName="><li>20-40</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=40&endPrice=80&searchName="><li>40-80</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=80&endPrice=100&searchName="><li>80-100</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=100&endPrice=150&searchName="><li>100-150</li></a>
						<a href="category?threeClassification=${threeClassification}&pageIdx=1&startPrice=150&endPrice=0&searchName="><li>150以上</li></a>
						<form class="price-order">
							<input type="text" name="startPrice">
							<span class="cc">-</span>
							<input type="text" name="endPrice">
							<input type="submit" value="确定">
						</form>
					</ul>
				</div>
			</div>
			<div class="sort-box bgf5">
				<div class="sort-text">排序：</div>
				<a href="javascript:void(0);"><div class="sort-text">销量 <i class="iconfont icon-sortDown"></i></div></a>
				<a href="javascript:void(0);"><div class="sort-text">评价 <i class="iconfont icon-sortUp"></i></div></a>
				<a href="javascript:void(0);"><div class="sort-text">价格 <i class="iconfont"></i></div></a>
				<div class="sort-total pull-right">共1666个商品</div>
			</div>
		</section>
		<section class="item-show__div clearfix">
			
			<div class="pull-left">
				<div class="item-list__area clearfix">
					<c:forEach items="${resultForm.resultList }" var="b">
						<div class="item-card">
							<input type="hidden" name="productId" value="${b.productId}"/>
							<a href="bookIndex?productId=${b.productId}" class="photo">
								<img src="${staticServerAddress }${b.bookMainImg}" alt="${b.productName}" class="cover">
								<div class="name">${b.productName}</div>
							</a>
							<div class="middle">
								<div class="price"><small>￥</small>${b.productPrice}</div>
								<div class="sale"><a href="javascript:void(0);" class="shopCart">加入购物车</a></div>
							</div>
							<div class="buttom">
								<div>销量 <b>666</b></div>
								<div>库存 <b>${b.productNum}</b></div>
								<div>评论 <b>1688</b></div>
							</div>
						</div>
					</c:forEach>
				</div>
				<!-- 分页 -->
				<div class="page text-right clearfix" style="margin-right: 300px;">
					<c:if test="${resultForm.totalPage>0}">
						<span <c:if test="${pageIdx==1}"> class="disabled" </c:if>>
							<a href="#" class="pager_index" data="${pageIdx>1?pageIdx-1:1}">上一页</a>
						</span>
						<c:forEach begin="1" end="${resultForm.totalPage }" var="i">
								<a href="javacript:;" class="pager_index" data="${i }" <c:if test="${pageIdx == i }">style="background-color: orange;"</c:if>>${i }</a>
						</c:forEach>
						<span <c:if test="${pageIdx==resultForm.totalPage }"> class="disabled" </c:if>>
							<a href="#" class="pager_index"	data="${pageIdx<resultForm.totalPage?pageIdx+1:resultForm.totalPage}">下一页</a>
						</span>
						<form action="" class="page-order">
							到第
							<input type="text" name="page">
							页
							<input class="sub" type="submit" value="确定">
						</form>
					</c:if>
				</div>
			</div>
			<div class="pull-right">
				
				<div class="desc-segments__content">
					<div class="lace-title">
						<span class="c6">爆款推荐</span>
					</div>
					<div class="picked-box">
						<a href="#" class="picked-item"><img src="images/temp/S-001.jpg" alt="" class="cover"><span class="look_price">¥134.99</span></a>
						<a href="#" class="picked-item"><img src="images/temp/S-002.jpg" alt="" class="cover"><span class="look_price">¥134.99</span></a>
					</div>
				</div>
			</div>
			<script>
			$(function() {
				$(".pager_index").click(function(e) {
			e.preventDefault();
			$("[name=pageIdx]").val($(this).attr("data"));
			$("#search").submit();
		});
		});
	
		</script>
		</section>
	</div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="toBreezeWelcome" class="r-item-hd">
					<i class="iconfont icon-user" ></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toBreezeShopcart" class="r-item-hd">
					<i class="iconfont icon-cart" data-badge="${shoppingCartNum==null?0:shoppingCartNum }" id="shoppingCart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toFavorite?pageIdx=1" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="#" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="toIssues" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 底部信息 -->
	<div class="footer">
		<div class="footer-tags">
			<div class="tags-box inner">
				<div class="tag-div">
					<img src="images/icons/footer_1.gif" alt="厂家直供">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_2.gif" alt="一件代发">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_3.gif" alt="美工活动支持">
				</div>
				<div class="tag-div">
					<img src="images/icons/footer_4.gif" alt="信誉认证">
				</div>
			</div>
		</div>
		<div class="footer-links inner">
			<dl>
				<dt>微风网</dt>
				<a href="toBreezeArticle10"><dd>企业简介</dd></a>
				<a href="toBreezeArticle11"><dd>加入微风</dd></a>
				<a href="toBreezeArticle12"><dd>隐私说明</dd></a>
			</dl>
			<dl>
				<dt>服务中心</dt>
				<a href="toBreezeArticle1"><dd>售后服务</dd></a>
				<a href="toBreezeArticle2"><dd>配送服务</dd></a>
				<a href="toBreezeArticle3"><dd>用户协议</dd></a>
				<a href="toBreezeArticle4"><dd>常见问题</dd></a>
			</dl>
			<dl>
				<dt>新手上路</dt>
				<a href="toBreezeArticle5"><dd>如何成为代理商</dd></a>
				<a href="toBreezeArticle6"><dd>代销商上架教程</dd></a>
				<a href="toBreezeArticle7"><dd>分销商常见问题</dd></a>
				<a href="toBreezeArticle8"><dd>付款账户</dd></a>
			</dl>
		</div>
		<div class="copy-box clearfix">
			<ul class="copy-links">
				<a href="toAgentLevel"><li>网店代销</li></a>
				<a href="toClassRoom"><li>微风学堂</li></a>
				<a href="toBreezeAbout"><li>联系我们</li></a>
				<a href="toBreezeArticle10"><li>企业简介</li></a>
				<a href="toBreezeArticle5"><li>新手上路</li></a>
			</ul>
			<!-- 版权 -->
			<p class="copyright">
				© 2018-2020 微风网 版权所有，并保留所有权利<br>
				ICP备案证书号：渝ICP备20181806号-2&nbsp;&nbsp;&nbsp;&nbsp;重庆市沙坪坝区微电子产业园区&nbsp;&nbsp;&nbsp;&nbsp;Tel: 15881909100&nbsp;&nbsp;&nbsp;&nbsp;E-mail: 15881909100@qq.com
			</p>
		</div>
	</div>
</body>
<script>
	$(function(){
		$(".shopCart").click(function(e){
			e.preventDefault();
			var scProductNum = 1;
			var productId = $(this).parent().parent().parent().children("input:first-child").val();
			$.ajax("addShopcart",{
				dataType:"json",
				data:{"productId":productId,"scProductNum":scProductNum},
				type:"post",
				success:function(result){
					 if(result.success){
						$("#shoppingCart").attr("data-badge",result.data);
					} 
				},
				error:function(xhr,e){
					console.error(e);
				}
			});
		})
	});
</script>
</html>